<!-- 我发布的 -->
<template>
	<view>
		<view class="p-3">
			<u-search
				placeholder="搜索"
				placeholder-color="#86909c"
				bg-color="#fff"
				@search="searchKeyFn"
				v-model="projectName"
				:show-action="false"
			></u-search>
		</view>
		<view class="tabsBox mb-1">
			<u-tabs
				:font-size="34"
				:height="80"
				bg-color="rgb(242 243 245)"
				inactive-color="#4E5969"
				active-color="#1d2129"
				:bar-width="60"
				:list="navList"
				:is-scroll="false"
				:current="navCurrent"
				@change="navChangeFn"
			></u-tabs>
		</view>
		<view v-if="navCurrent == 0" class="  d-flex a-center px-3 j-start">
			<view
				class="rounded bg-write text-main u-m-r-14 px-1 py-1 font "
				v-for="(item, index) in receivingStateList"
				:key="index"
				:class="[{ 'active-class': activeIndex == index }]"
				@click="toggleActive(item.value)"
			>
				{{ item.label }}
			</view>
		</view>

		<view class=" px-3 d-flex">
			<!-- :style="{ color: color, fontWeight: fontWeight }" -->
			<view class="date" @click="acceptDatePickerFn" style="z-index: 99;">
				<view class="pr d-flex ">
					反馈时间
					<view class="d-flex flex-column pl-1">
						<view
							class="iconfont icon-shangjiantou "
							:class="changeColor ? 'text-primary' : 'text-success'"
							style="height: 20rpx; font-size: 22rpx; margin-top: -6rpx;"
						></view>
						<view
							class="iconfont icon-xiajiantou "
							:class="changeColor ? 'text-success' : 'text-primary'"
							style="height: 20rpx;font-size: 22rpx;margin-top: -6rpx;"
						></view>
					</view>
				</view>
			</view>
			<view class="operateBox">
				<u-dropdown>
					<u-dropdown-item
						v-model="rootInformationEnum"
						:title="rootInformList[rootInformationEnum].label"
						:options="rootInformList"
						@change="changeRootInformationEnumFn"
					></u-dropdown-item>
					<u-dropdown-item
						v-model="projectStage"
						:title="projectPhaseList[projectStage].label"
						:options="projectPhaseList"
						@change="changeProjectStageFn"
					></u-dropdown-item>
				</u-dropdown>
			</view>
		</view>

		<z-paging ref="paging" v-model="dataList" use-page-scroll refresher-no-transform @query="queryList">
			<view
				class="projectBox p-3 m-3 rounded-8 bg-write line-h-md text-l"
				v-for="(item, index) in dataList"
				:key="index"
				@click="projectDetailsFn(item)"
			>
				<view class="d-flex j-sb a-center">
					<view class="font text-h">发布时间：{{ item.createDateTime }}</view>
					<!-- 已通过显示接收状态，未审核/未通过显示审核状态 -->
					<view v-if="navCurrent == 0" class="rounded  px-2  py-1 font" :class="[changeBg(item)]">
						{{ item.acceptStatusName }}
					</view>
					<view v-else class=" rounded  px-2 py-1 font" :class="[changeBg(item)]">
						{{ item.auditStatusName }}
					</view>
				</view>
				<view class="font-lg text-main font-weight">{{ item.projectName }}</view>
				<view class="u-flex u-row-between">
					<view class="bg-grey  px-1 py text-primary font">{{ item.rootInformationEnumName }}</view>
					<view class="text-primary font">
						<image
							class="imagesBox"
							mode="aspectFit"
							style="width: 46rpx ; height: 16rpx;"
							:src="getStaticFilePath('ico-jd.png')"
						></image>
						{{ item.projectStageName }}
					</view>
				</view>
				<view class="p-2 my-2 bg-grey rounded line-h-md">
					<view class="d-flex a-center">
						<view class="flex-1 ">
							<text class="text-tips font">信息类型：</text>
							<text class="text-main font ">{{ item.infoTypeName }}</text>
						</view>
						<view class="flex-1">
							<text class="text-tips font">预计产值规模：</text>
							<text class="text-main font ">{{ item.outputScale }}</text>
						</view>
					</view>
					<view class="d-flex a-center">
						<view class="flex-1">
							<text class="text-tips font">省份：</text>
							<text class="text-main font ">{{ item.province }}</text>
						</view>
						<view class="flex-1">
							<text class="text-tips font">城市：</text>
							<text class="text-main font ">{{ item.city }}</text>
						</view>
					</view>
					<view class="d-flex j-sb mt-2 a-center">
						<view class="d-flex a-center">
							<view class="iconfont icon-calendar-todo-fill text-primary"></view>
							<view class="text-main font ml-1">{{ item.projectAddressName }}</view>
						</view>
					</view>
				</view>
				<view class="listBnt d-flex j-end">
					<button
						v-if="navCurrent == 0 && activeIndex == 1"
						class="errorListBigBnt btn-cancel mr-1"
						@click.stop="feedbackSituationFn(item)"
					>
						反馈情况
					</button>

					<button
						v-if="item.rootInformationEnumName == '派生信息'"
						class="editListBigBnt btn-cancel  mr-1"
						@click.stop="projectDetailsFn(item)"
					>
						查看源信息
					</button>

					<button
						v-if="navCurrent == 0"
						class="primaryListBigBnt btn-cancel  "
						@click.stop="receptionConditionFn(item)"
					>
						接收情况
					</button>
					<button
						v-if="navCurrent == 1 && item.auditStatus != 'CancelAudit'"
						class="errorListBnt btn-cancel  mr-1"
						@click.stop="hanglgRevocationFn(item)"
					>
						撤回
					</button>
					<button
						v-if="navCurrent == 2 || (navCurrent == 1 && item.auditStatus == 'CancelAudit')"
						class="editListBnt btn-cancel  mr-1"
						@click.stop="hanglgEditFn(item)"
					>
						修改
					</button>
				</view>
			</view>
		</z-paging>
		<u-modal v-model="show" @confirm="exitLoginOutFn" :show-cancel-button="true" :content="content"></u-modal>
	</view>
</template>

<script>
import { getBusiInfoPage, cancelData } from '@/api/apis.js';
import { receivingStateList, rootInformList, projectPhaseList } from '@/utils/data.js';
export default {
	data() {
		return {
			projectName: '',
			receivingStateList,
			activeIndex: null,
			color: 'rgb(96, 98, 102)',
			iconColor: '#c0c4cc',
			fontWeight: 'normal',
			changeColor: false,
			rootInformList,
			projectPhaseList,
			projectStage: 4, //项目阶段
			rootInformationEnum: 2, //信息源
			auditStatus: '2', //审核状态
			navCurrent: 0,
			dataList: [],
			navList: [
				{
					name: '已通过'
				},
				{
					name: '未审核'
				},
				{
					name: '未通过'
				}
			],
			show: false,
			content: '您确认要撤回吗？'
		};
	},
	options: {
		styleIsolation: 'shared' // 解除样式隔离
	},
	methods: {
		//改变颜色
		changeBg(item) {
			if (this.navCurrent == 0) {
				if (item.acceptStatus == 'Receive') {
					return 'bg-blue text-blue';
				} else if (item.acceptStatus == 'UnReceive') {
					return 'bg-success-1 text-primary';
				} else if (item.acceptStatus == 'Rejection') {
					return 'bg-error-2 text-error';
				} else if (item.acceptStatus == 'SectionReceive') {
					return 'bg-warning text-warning';
				}
			} else {
				if (item.auditStatus == 'PendingReview' || item.auditStatus == 'Pass') {
					return 'bg-blue text-blue';
				} else if (item.auditStatus == 'UnderReview') {
					return 'bg-success-1 text-primary';
				} else if (item.auditStatus == 'CancelAudit' || item.auditStatus == 'NotPass') {
					return 'bg-error-2 text-error';
				}
			}

			// if (item.auditStatusName === '审核中' || item.acceptStatusName == '跟进中') {
			// 	return 'bg-blue text-blue';
			// } else if (
			// 	item.auditStatusName == '未审核' ||
			// 	item.acceptStatusName == '未接洽' ||
			// 	item.acceptStatusName == '未接收'
			// ) {
			// 	return 'bg-success-1 text-primary';
			// } else if (
			// 	item.auditStatusName == '未通过' ||
			// 	item.acceptStatusName == '已拒收' ||
			// 	item.auditStatusName == '驳回'
			// ) {
			// 	return 'bg-error-2 text-error';
			// } else if (item.acceptStatusName == '已部分接收') {
			// 	return 'bg-warning text-warning';
			// }
		},
		navChangeFn(e) {
			this.navCurrent = e;
			this.$refs.paging.reload();
		},
		searchKeyFn() {
			this.$refs.paging.reload();
		},
		toggleActive(index) {
			if (this.activeIndex === index) {
				this.activeIndex = null;
			} else {
				this.activeIndex = index;
			}
			this.$refs.paging.reload();
		},
		queryList(pageNo, pageSize) {
			if (this.navCurrent == 0) {
				this.auditStatus = 2;
			} else if (this.navCurrent == 1) {
				this.auditStatus = 1;
			} else {
				this.auditStatus = 3;
			}
			getBusiInfoPage({
				page: pageNo,
				size: pageSize,
				auditStatus: this.auditStatus, //审核状态
				orderBy: this.changeColor ? 1 : 0, //排序
				appUnaudited: this.navCurrent == 1 ? true : false,
				rootInformationEnum: this.rootInformationEnum == 2 ? '' : this.rootInformationEnum, //信息源
				projectName: this.projectName,
				acceptStatus: this.navCurrent == 0 ? this.activeIndex : '', //接收状态
				projectStage: this.projectStage == 4 ? '' : this.projectStage //项目阶段
			}).then(res => {
				if (res.code == 10000) {
					this.$refs.paging.complete(res.data.data);
				} else {
					this.$refs.paging.complete(false);
				}
			});
		},
		//点击发布时间
		acceptDatePickerFn() {
			this.changeColor = !this.changeColor;
			this.color = this.changeColor ? '#4e5969' : '#606266';
			this.fontWeight = this.changeColor ? '700' : 'normal';
			this.iconColor = this.changeColor ? '#4e5969' : '#c0c4cc';
			this.$refs.paging.reload();
		},
		changeRootInformationEnumFn(e) {
			this.rootInformationEnum = e;
			this.$refs.paging.reload();
		},
		//点击下拉选
		changeProjectStageFn(e) {
			this.projectStage = e;
			this.$refs.paging.reload();
		},
		//项目详情
		projectDetailsFn(item) {
			this.$Router.push({
				path: '/detailPages/pages/projectDetails/index',
				query: {
					busiInfoId: item.busiInfoId
				}
			});
		},
		//接收情况
		receptionConditionFn(item) {
			this.$Router.push({
				path: '/detailPages/pages/projectDetailsReceived/index',
				query: {
					busiInfoId: item.busiInfoId
				}
			});
		},
		//反馈情况
		feedbackSituationFn(item) {
			this.$Router.push({
				path: '/detailPages/pages/projectDetailsFeedbackSituation/index',
				query: {
					busiInfoId: item.busiInfoId
				}
			});
		},
		//修改
		hanglgEditFn(item) {
			this.$Router.replaceAll({
				path: '/pages/postMessage/index',
				query: {
					busiInfoId: item.busiInfoId
				}
			});
		},
		//撤回
		hanglgRevocationFn(item) {
			this.busiInfoId = item.busiInfoId;
			this.show = true;
		},
		//确定撤回
		exitLoginOutFn() {
			cancelData({
				busiInfoId: this.busiInfoId
			}).then(res => {
				if (res.code == 10000) {
					this.$refs.paging.reload();
				} else {
					this.$u.toast(res.msg);
				}
			});
		}
	}
};
</script>

<style lang="scss" scoped>
::v-deep .u-content {
	height: 80rpx !important;
}
::v-deep .uicon-search {
	color: #0052d9 !important;
}
::v-deep .u-dropdown__menu__item__text ::after {
	font-family: 'iconfont';
	content: '\eb6d';
	padding-left: 10rpx;
	color: #0052d9;
	font-size: 20rpx;
}
::v-deep .u-dropdown__menu__item__arrow {
	display: none !important;
}
.operateBox {
	width: 310rpx;
}
.date {
	line-height: 80rpx;
	font-size: 28rpx;
}
.active-class {
	background-color: #0052d9;
	color: #fff;
}

::v-deep .u-dropdown__content {
	width: 750rpx !important;
	left: -170rpx !important;
}

::v-deep .u-tab-bar {
	background-color: #0052d9 !important;
}
</style>
